Vue Js Display Date Time of Document last Modified:Vue.js provides a simple way to retrieve the timestamp using the built-in document.lastModified property. Once the timestamp is retrieved, it can be formatted using the Date object to display the date and time in a readable format. This method is useful for providing users with up-to-date information and ensuring that the content is relevant and accurate.

How can I use Vue js to display the date and time of the last modification/update of a document?

This Vue.js code creates an input field and a paragraph element that displays the date and time when the document was last modified.

The v-model directive binds the input field’s value to the myDataProperty data property in the Vue instance. Whenever the input field’s value changes, the updateLastModified method is called.

The lastModified data property is initially set to null, and the mounted hook is used to set it to the date and time when the document was last modified.

The updateLastModified method updates the lastModified property to the current date and time using the toLocaleString method, which returns a string representation of the date and time according to the user’s locale.

Vue Js Display date time of document when last modified/updated Example

<div id="app">
        <input v-model="myDataProperty" @input="updateLastModified()">
        <p>Last modified: {{ lastModified }}</p>
    </div>
    <script type="module">
        const app = new Vue({
            el: "#app",
            data() {
                return {
                    myDataProperty: '',
                    lastModified: null,
                };
            },
            methods: {
                updateLastModified() {
                    this.lastModified = new Date().toLocaleString();
                }
            },
            mounted() {
                this.lastModified = new Date(document.lastModified).toLocaleString();
            },
        })
    </script>

Output of Vue Js Display date time of document when last modified/updated